import React from 'react';
import ReactAplayer from 'react-aplayer';
import music from '../assets/伟大.mp3'
import music1 from '../assets/如此.mp3'
import pig from '../assets/zz.png'
import zz from '../assets/zz.lrc'
import z1 from '../assets/z1.lrc'
import pig1 from '../assets/11.png'
export default class Music extends React.Component {
    // event binding example
    onPlay = () => {
        console.log('on play');
    };

    onPause = () => {
        console.log('on pause');
    };

    // example of access aplayer instance
    onInit = ap => {
        this.ap = ap;
    };

    render() {
        const props = {
            theme: '#F57F17',
            lrcType: 3,
            audio: [
                {
                    name: '最伟大的作品',
                    artist: '周杰伦',
                    url: music,
                    cover: pig,
                    lrc: zz,
                    theme: '#ebd0c2',
                },
                {
                    name: '我是如此的相信',
                    artist: '周杰伦',
                    url: music1,
                    cover: pig1,
                    lrc: z1,
                    theme: '#ebd0c2',
                }
            ]
        };

        return (
            <div>
                <ReactAplayer
                    {...props}
                    onInit={this.onInit}
                    onPlay={this.onPlay}
                    onPause={this.onPause}
                />
            </div>
        );
    }
}